
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>编辑角色</title>
<meta name="author" content="yinqi">
<link href="/admin/utils/layui/css/style.min.css" rel="stylesheet">
<link rel="stylesheet" href="/admin/utils/layui/css/layui.css">
<style type="text/css">
.page_container {
    padding:8px;
	margin-top:20px;
}
.lyear-checkbox{
margin-left: 18px;
}
</style>
</head>
  
<body style="background: #fff;">
<div class="page_container" id="view">
          
  <form action="" method="post"  onsubmit="return submitForm(this)">
	<input id="_method" type="hidden" name="_method" value="POST">
	  <div class="layui-form-item">
        <label class="layui-form-label">角色名称</label>
        <div class="layui-input-block">
          <input type="text" name="role_name" id="role_name" lay-verify="required" autocomplete="off" placeholder="请输入角色名称" class="layui-input" value="{{d.data.role_name}}">
        </div>
      </div>
	  <div class="layui-form-item">
        <label class="layui-form-label">权限菜单</label>
        <div class="layui-input-block">
          <div class="table-responsive">
             {{d.menu_html}}
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button type="submit" class="layui-btn" lay-submit lay-filter="formDemo">确认</button>
          <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
      </div>
  	
  </form>
  
</div>

<script type="text/javascript" src="/static/lyear/js/jquery.min.js"></script>

<script type="text/javascript" src="/static/lyear/js/chosen.jquery.min.js"></script>
<script src="/static/layuimini/js/tool.js" charset="utf-8"></script>
<script src="/admin/utils/layui/layui.js" charset="utf-8"></script>
<script src="/admin/utils/layui/config.js" charset="utf-8"></script>
<script type="text/javascript">
	layui.use(['view','layer', 'helper'], function() {
		let view = layui.view;
		window.$ = layui.$;
		view.init($_GET['api']+"?_method=PUT&event=edit&role_id="+$_GET['role_id'], function(res){
			var menus = res.data.data.menus;
			$(function(){
				// 复选框全选
				$("#check-all").change(function () {
					$("input[type='checkbox']").prop('checked', $(this).prop("checked"));
				});
				//动态选择框，上下级选中状态变化
				$('input.checkbox-parent').on('change', function(){
					var dataid = $(this).attr("dataid");
					$('input[dataid^=' + dataid + '-]').prop('checked', $(this).is(':checked'));
				});
				$('input.checkbox-child').on('change', function(){
					var dataid = $(this).attr("dataid");
						dataid = dataid.substring(0, dataid.lastIndexOf("-"));
					var parent = $('input[dataid=' + dataid + ']');
					if($(this).is(':checked')){
						parent.prop('checked', true);
						//循环到顶级
						while(dataid.lastIndexOf("-") != 2){
							dataid = dataid.substring(0, dataid.lastIndexOf("-"));
							parent = $('input[dataid=' + dataid + ']');
							parent.prop('checked', true);
						}
					}else{
						//父级
						if($('input[dataid^=' + dataid + '-]:checked').length == 0){
							parent.prop('checked', false);
							//循环到顶级
							while(dataid.lastIndexOf("-") != 2){
								dataid = dataid.substring(0, dataid.lastIndexOf("-"));
								parent = $('input[dataid=' + dataid + ']');
								if($('input[dataid^=' + dataid + '-]:checked').length == 0){
									parent.prop('checked', false);
								}
							}
						}
					}
				});
				
				
				if(menus){
					menus = eval('('+menus+')');
				}
				//选择所有的复选框
				$("input[type='checkbox']").each(function(index){
					if(in_array($(this).val(), menus)){
						$(this).prop('checked', true);
					}
				});
			});
			
			
		});	
	});

function submitForm(obj){
	if($('#role_name').val() == ''){
		noticeMsg('error', "角色名称不能为空");
		return false;
	}
	var data = $(obj).serializeArray();
	var menus = [];
	for(i in data){
		if(data[i]['name'] == 'rules[]'){
			menus.push(data[i]['value']);
		}
	}

	if(menus == false){
		noticeMsg('error', "请选择权限菜单");
		return false;
	}
	ajax_request($_GET['api']+"?_method=POST", "POST", {"role_name":$('#role_name').val(),"menus":JSON.stringify(menus), "_method":"PUT","update_time":"","role_id":$_GET['role_id']}, function(res){
		noticeMsg("success", "添加成功");
		parent.window.location.reload();
	});
	
	return false;
}


</script>
</body>
</html>